import Vue from "vue"

import VueRouter from "vue-router";

import store from "@/store";

//路由懒加载
const Login = () => import("@pages/Login");
const Home = () => import("@pages/Home");
const Search = () => import("@pages/Search");
const Register = () => import("@pages/Register");
const Detail = () => import("@pages/Detail");
const AddCartSuccess = () => import("@pages/AddCartSuccess");
const ShopCart = () => import("@pages/ShopCart");
const Trade = () => import("@pages/Trade");
const Pay = () => import("@pages/Pay");
const PaySuccess = () => import("@pages/PaySuccess");
const Center = () => import("@pages/Center");

Vue.use(VueRouter)

//重写router的push方法
//1.拿到原来的push方法
const lastPush = VueRouter.prototype.push
VueRouter.prototype.push = function (location, onComplete = () => {}, onAbort = () => {}) {
    return lastPush.call(this, location, onComplete, onAbort)
}

const router =  new VueRouter({
    scrollBehavior() {
        // return 期望滚动到哪个的位置
        return{
            x:0,
            y:0
        }
    },
    //history模式
    mode: "history",
    routes: [{
            path: "/login",
            component: Login,
            name: "login",
            meta: {
                isFooterHidden: true
            },
            //login路由独享守卫限制登录状态不能在访问这个路由
            beforeEnter (to, from, next) {
                if(store.state.user.token){
                    console.log(111);
                    next("/")
                }else{
                    next()
                }
            }
        },
        {
            path: "/home",
            component: Home,
            name: "home"
        },
        {
            path: "/search/:keyword?",
            component: Search,
            name: "search"
        },
        {
            path: "/register",
            component: Register,
            name: "register",
            meta: {
                isFooterHidden: true
            }
        },
        {
            path: "/detail/:skuId",
            component: Detail,
            name: "detail"
        },
        {
            path: "/addCartSuccess",
            component: AddCartSuccess,
            name: "addCartSuccess",
            //路由独享守卫限制只有添加购物车成功才能进这个页面
            beforeEnter(to , from , next){
                if(sessionStorage.getItem("cartData")){
                    next()
                }else{
                    next("/shopCart")
                }
            }
        },
        {
            path: "/shopCart",
            component: ShopCart,
            name: "shopCart"
        },
        {
            path: "/trade",
            component: Trade,
            name: "trade"
        },
        {
            path: "/pay",
            component: Pay,
            name: "pay"
        },
        {
            path: "/paysuccess",
            component: PaySuccess,
            name: "paysuccess"
        },
        {
            path: "/center",
            component: Center,
            name: "center"
        },
        {
            path: "/",
            redirect: "/home"
        }
    ]
})

//全局前置守卫
router.beforeEach((to , from , next) => {
    //设置需要token才能进的路由
    const CheckPath = ["/center", "/pay", "/paysuccess", "/trade"]

    //判断当前要去的地方是否需要权限校验
    const isCheckPath = CheckPath.some((item) => {
        return to.path.startsWith(item)
    })

    //拿到token和用户名
    const token = store.state.user.token
    const nickName = store.state.user.nickName

    //如果有用户名直接全部通过
    if(nickName){
        return next()
    }

    //没有用户名判断是否需要权限僬侥
    if(isCheckPath){
        if(token){
            store.dispatch("user/getUserName")
            next()
        }else{
            next("/login")
        }
    }else{
       //不需要权限校验的路由如果有token则顺便获取用户名
       if(token){
        store.dispatch("user/getUserName")
       } 
       next()
    }

})


export default router